#@layout()

#define script()
<script>

    $(".template-enable").on("click", function () {
        var templateId = $(this).attr("for-tid");
        ajaxGet("#(CPATH)/admin/template/doEnable?tid=" + templateId);
    })

    $(".template-uninstall").on("click", function () {
        if (confirm('确定要卸载该主题吗？卸载后不可恢复')) {
            var templateId = $(this).attr("for-tid");
            ajaxGet("#(CPATH)/admin/template/doUninstall?tid=" + templateId);
        }
    })

    function onPreviewSwitchClick(isChecked, elem, switchery) {
        if (isChecked) {
            $('.preview').show()
        } else {
            $('.preview').hide()
        }
        ajaxGet("#(CPATH)/admin/template/doTriggerTemplateEnable",function (){})
    }


</script>
#end

#define css()
<style>
    .card-body img {
        width: 100%;
        height: 200px;
        border-top-left-radius: 2px;
        border-top-right-radius: 2px;
    }

    .card-footer .title {
        padding-top: 7px;
    }
    .form-group a{
        color:#007bff;
        font-weight: 500;
    }
    .form-group a:hover{
        color:#0069d9;
    }

</style>
#end

#define content()
<section class="content-header">

    <div class="container-fluid">
        <div class="row">
            <div class="col-sm-6">

                <div class="row mb-2">
                    <div class="col-sm-12">
                        <h1>
                            模板管理
                            <small data-toggle="tooltip" title="" data-placement="right"
                                   data-trigger="hover"><i class="nav-icon far fa-question-circle"></i></small>
                            <small> 首页 / 模板 / 模板管理</small>
                        </h1>
                    </div>
                </div>
            </div>
        </div>

    </div><!-- /.container-fluid -->
</section>

<section class="content">

    <div class="container-fluid">
        <div class="card card-outline card-primary">
            <div class="card-header with-border">
                <form class=" admin-search-panel" action="" method="get">
                    <div class="row">
                        <div class="form-group col-lg-2">
                            <input type="text" placeholder="模板名称" class="form-control" name="title"
                                   value="#para('title')">
                        </div>

                        <div class="form-group col-lg-4">
                            <button type="submit" class="btn btn-primary ">查询</button>
                            <button type="reset" class="btn btn-default">重置</button>
                            <a href="#(CPATH)/admin/template/install" class="btn"> 安装新模板 </a>
                        </div>

                        <div class="offset-4 form-group col-lg-2 row">
                            <label class="col-sm-6 col-form-label">预览功能</label>
                            <div class="col-sm-6">
                                <input type="checkbox" class="switchery" data-change-function="onPreviewSwitchClick"
                                       data-for="web_template_preview_enable" #checkedIf(option("web_template_preview_enable")) >
                                <input type="hidden" id="web_template_preview_enable" name="web_template_preview_enable">
                            </div>
                        </div>
                    </div>
                    <!-- /.card-body -->
                </form>


            </div>
            <!-- /.card-header -->
            <div class="card-body">

                <div class="row">

                    #for(template : templates)
                    <div class="col-lg-4">
                        <!-- jQuery Knob -->
                        <div class="card card-outline card-dashboard">
                            <!-- /.card-header -->
                            <div class="card-body p-0">
                                <img src="#(CPATH)#(template.screenshot ??)"/>
                                <!-- /.row -->
                            </div>
                            <!-- /.card-body -->
                            <div class="card-footer">
                                <label class="title">#(template.title ??) <a class="preview" href="#(CPATH)/?template=#(template.id ??)" target="_blank" #if(!option('web_template_preview_enable'))style="display: none"#end> - 预览</a> </label>
                                #if(option('web_template') == template.id)
                                <button type="button" class="btn btn-default disabled float-right" disabled>
                                    <i class="fa fa-fw fa-check"></i>已启用
                                </button>
                                #else
                                <div class="float-right">
                                    <button type="button" class="btn btn-default template-uninstall"
                                            for-tid="#(template.id)">卸载
                                    </button>
                                    <button type="button" class="btn btn-primary template-enable"
                                            for-tid="#(template.id)">启用
                                    </button>
                                </div>

                                #end
                            </div>
                        </div>
                        <!-- /.card -->
                    </div>
                    #end

                    <!-- /.col -->
                </div>


            </div>
        </div>
        <!-- /.card -->
    </div>
</section>

#end
